<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>杨澎锴的实践作业09</title>
    <link rel="stylesheet" href="practice.css" />
  </head>
  <body>
    <a href="../index1.html">返回首页</a>
    <p><a href="/08/draw.html">动画变形和过渡集合</a></p>
    <p><a href="/08/an.html">使用专业的css链接</a></p>
    <h1 style="text-align: center;">css变形以及动画</h1>
    <section class="chr">
      <h2>角度、阴影、背景练习</h2>
      <div class="or">
        这是一个div元素正的还有x10px，y10px，z20px的阴影
      </div>
      背景还有采用opacity变透明哦
      <div class="deg">
        这是一个有角度deg有圆角border-radius: 15px;的div元素
      </div>
      <div class="big">
        这是一个放大margin：0 auto居中，还浮动inline-end
      </div>
      <div class="xuan">我能旋转</div>
      <div class="td">3d旋转</div>
    </section>
    <section>
      <div class="box">拉长颜色改变</div>
      <div class="ra">圆角</div>
      <div class="ease">拉长而已</div>
    </section>
    <section>
      <h2 style="text-align: center;">线段动画效果</h2>
      <hr />
      <div class="time">实现时间分别变化</div>
    </section>
    <section></section>
  </body>
</html>
